<template>
    <scroll-view ref="emoji-scroll" class="emoji-scroll" :scroll-y="true">
        <view class="emoji-box">
            <text v-for="(emoji, key) in list" :key="key" class="emoji-item"
                :data-value="key"
                :decode="true"
                @click="send(emoji)">
                {{ emoji }}
            </text>
        </view>
    </scroll-view>
</template>

<script>
    export default{
        name: "emoji-list",
        data(){
            return {
                list: ['E000',
                    '😀', '😁', '😂', '😃', '😄', '😅', '😆', '😉', '😊', '😋', '😎', '😍', '😘', 
                    '😗', '😙', '😚', '😇', '😐', '😑', '😶', '😏', '😣', '😥', '😮', '😯', '😪', 
                    '😫', '😴', '😌', '😛', '😜', '😝', '😒', '😓', '😔', '😕', '😲', '😷', '😖', 
                    '😞', '😟', '😤', '😢', '😭', '😦', '😧', '😨', '😬', '😰', '😱', '😳', '😵', 
                    '😡', '😠', '😈', '👹', '👺', '💀', '👻', '👽', '👦', '👧', '👨', '👩', '👴', 
                    '👵', '👶', '👱', '👮', '👲', '👳', '👷', '👸', '💂', '🎅', '👰', '👼', '💆', 
                    '💇', '🙍', '🙎', '🙅',  '🙆', '💁', '🙋', '🙇', '🙌', '🙏', '👤', '👥', '🚶', 
                    '🏃', '👯', '💃', '👫', '👬', '👭', '💏', '💑', '👪', '💪', '👈', '👉', '☝', 
                    '👆', '👇', '✌', '✋', '👌', '👍', '👎', '✊', '👊', '👋', '👏', '👐', '✍', '🙈', '🙉', '🙊',
                    '🐵', '🐒', '🐶', '🐕', '🐩', '🐺', '🐱', '😺', '😸', '😹', '😻', '😼', '😽', '🙀', '😿', '😾', 
                    '🐈', '🐯', '🐅', '🐆', '🐴', '🐎', '🐮', '🐂', '🐃', '🐄', '🐷', '🐖', '🐗', '🐽', '🐏', '🐑', 
                    '🐐', '🐪', '🐫', '🐘', '🐭', '🐁', '🐀', '🐹', '🐰', '🐇', '🐻', '🐨', '🐼', '🐾', '🐔', '🐓', 
                    '🐣', '🐤', '🐥', '🐦', '🐧', '🐸', '🐊', '🐢', '🐍', '🐲', '🐉', '🐳', '🐋', '🐬', '🐟', '🐠', 
                    '🐡', '🐙', '🐚', '🐌', '🐛', '🐜', '🐝', '🐞', '�', '🐚', '🌎', '🌍', '🌏', '🌕', '🌖', '🌗', 
                    '🌘', '🌑', '🌒', '🌓', '🌔', '🌙', '🍀', '🌿', '☘', '🌱', '🌴', '🌳', '⭐', '🌟', '💫', '✨', 
                    '☄', '🪐', '🌞', '☀', '🌤', '⛅', '🌥', '🌦', '☁', '🌧', '⛈', '🌩', '⚡', '💥', '❄', 
                    '🌨', '☃', '⛄', '🌬', '💨', '🌪', '🌫', '☔', '🖋'
                ],
            }
        },
        created() {
           
        },
        methods:{
            //输入表情
            send(e){
                this.$emit('change', e)
            },
        }
    }
</script>

<style scoped>
.emoji-scroll{
    /* #ifndef APP-NVUE */
    display: flex;
    height: 100%;
    /* #endif */
    flex-direction: column;
    align-items: center;
    padding-top: 20rpx;
    padding-bottom: 20rpx;
}
.emoji-box{
    /* #ifndef APP-NVUE */
    display: flex;
    /* #endif */
    flex-wrap: wrap;
    flex-direction: row;
    padding-bottom: 100rpx;
    box-sizing: border-box;
}
.emoji-item{
    width: 60rpx;
    height: 60rpx;
    margin-left: 20rpx;
    margin-right: 20rpx;
    margin-top: 20rpx;
    font-size: 50rpx;
}
</style>
